iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 18
0
自我挑戰組

草頭黃小姐的 30 天 JavaScript 自學小本本系列 第 18

Day 18 物件導向程式設計之二三事

  • 分享至 

  • xImage
  •  

延續上回的物件,我們學會使用以下兩種方式:

  • 使用 Object()函數
  • 使用大括號

但你是否有聽過物件裡面還可以再包物件,我們舉個例子來說:

Var hero1 {
    name:`神力女超人`,
    skill:[`打擊敵人`, `盾牌`,`神劍`],
    power:10000;
    location:{
     plante:`地球`,
     add:`美國`,
    }
}

我們在 location 的地方包了一個 key,然後後面那個大括號又是另外一個物件。
也就是我們在 hero1 是一個大物件然後包了一個 location 的物件。

除了物件之外,我們也可以把 function 包進物件內:

Var hero1 {
    name:`神力女超人`,
    skill:[`打擊敵人`, `盾牌`,`神劍`],
    power:10000;
    finalSkill: function(){
    return this.skill[1];
    }
}

console.log(hero1.finalSkill());

加入了 finalSkill,並在第四行的地方加入了 function,那他們的 Key 可以是一個 return 值,要回傳什麼呢?要回傳這個 skill 的第一個元素,而 skill 的元素起始值,會從 0 開始算起,因此第二個值- 盾牌 便是 console.log 印出的東西。

劇透>>functional contrustor 函式建構式

這個名詞乍聽之下有點硬,我們就透過例子來做比較具體的說明,我們開始寫一個叫做 Pokemo 的 function,然後放了兩個參數:

function Pokemo(name, skill){
 this name = name;
 this skill = skill;
}

其實我們剛剛在做的就是用 function 當樣板產生一個新的物件。不曉得大家有吃過雞蛋糕嗎?雞蛋糕的烤盤倒滿料後,一次一次會產生全新的雞蛋糕出來,這個烤盤的概念我們可以稱它為 類別

下回我們就來瞧瞧看要怎麼操作:)


上一篇
Day 17 物件導向程式設計
下一篇
Day 19 物件導向程式設計 part 2
系列文
草頭黃小姐的 30 天 JavaScript 自學小本本30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言